// >>>>> 卡片视图 <<<<<
.card {
    @apply border border-gray-300 rounded bg-white relative p-6 shadow-sm;

    & + & {
        @apply mt-6;
    }

    // 卡片顶部
    &-top {
        @apply flex items-center pb-6;
    }

    // 卡片标题
    &-title {
        @apply text-lg;
    }

    // 卡片内容
    &-content {
    }

    // 卡片底部
    &-bottom {
        @apply flex items-center pt-6;
    }

    // 卡片底部左侧
    &-left {
        @apply mr-4;
    }

    // 卡片右侧
    &-right {
        @apply ml-auto flex flex-shrink-0 space-x-3;
    }

    // 没有阴影
    &.no_shadow {
        @apply p-0 shadow-none;
    }

    // 顶部没有内边距
    &.top_has_no_padding &-top {
        @apply px-0;
    }

    // 内容没有内边距
    &.content_has_no_padding &-content {
        @apply px-0;
    }

    // 底部没有内边距
    &.bottom_has_no_padding &-bottom {
        @apply px-0;
    }
}
